<template>
  <div>
    <!-- this is User page! -->
    <!-- breadcrumb nav -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item :to="{ path: '/manager' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>系统管理</el-breadcrumb-item>
        <el-breadcrumb-item>用户信息</el-breadcrumb-item>
    </el-breadcrumb>

    <!-- 选择的下拉框 -->
    <el-card style="margin-top: 15px;" shadow="always" :body-style="{ padding: '20px' }">
      <el-row :gutter="20">
        <el-col :span="5" :offset="0">
          <el-select v-model="selectedRole" size="small" placeholder="请选择">
            <el-option
              v-for="item in roleOption"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-col>
        <el-col :span="12" :offset="0">
          <el-button type="school" size="small" @click="getUserList()">查询</el-button>
        </el-col>
      </el-row>
    </el-card>

    <!-- 展示用户的信息 -->
    <el-card style="margin-top: 15px; padding-bottom: 10px;" shadow="always" :body-style="{ padding: '20px' }">
      <!-- card body -->
      <el-button type="school" size="default" @click="addUser()">新增用户</el-button>

      <el-table :data="userTable" style="margin-top: 10px;" stripe>
        <el-table-column
          label="创建时间"
          prop="create_time"
          align="center"
          width="">
        </el-table-column>
        <el-table-column
          label="创建人"
          prop="create_by"
          align="center"
          width="">
        </el-table-column>
        <el-table-column
          label="账号名"
          prop="username"
          align="center"
          width="">
        </el-table-column>
        <el-table-column
          label="角色"
          prop="role"
          align="center"
          width="">
        </el-table-column>
        <el-table-column
          label="是否在线"
          prop=""
          align="center"
          width="">
          <template slot-scope="scope">
            {{ scope.row.loginState == 1 ? '是' : '否'}}
          </template>
        </el-table-column>
        <el-table-column
          label="是否冻结"
          prop=""
          align="center"
          width="">
          <template slot-scope="scope">
            {{ scope.row.banState == 1 ? '是' : '否'}}
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          prop=""
          align="center"
          width="280">
          <template slot-scope="scope">
            <el-button type="danger" :disabled="scope.row.loginState == 0" size="small" @click="logoutUser(scope.row.id)">下线</el-button>
            <el-button type="primary" size="small" @click="frozenUser(scope.row)">
              {{ scope.row.banState == 0 ? '冻结' : '解冻' }}
            </el-button>
            <el-button type="school" size="small" @click="editUserInfo(scope.row)">
              {{ (scope.row.identity === 1 || scope.row.identity === 4) ? '查看' : '编辑'}}
            </el-button>
            <el-button type="danger" plain size="small" @click="deleteUser(scope.row.id)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>

      <!-- 分页导航 -->
      <el-pagination
        background
        style="float: right; margin-top: 10px;"
        :page-size="10"
        @current-change="handleCurrentChange"
        layout="total, prev, pager, next"
        :total="userNum">
      </el-pagination>
    </el-card>

    <!-- 添加管理员 -->
    <el-dialog
      title="添加管理员"
      :visible.sync="addManagerDialog"
      width="30%"
      :before-close="handleClose">
      <el-form :model="addManager" ref="addManagerForm" :rules="addManagerRules" label-width="80px" :inline="false" size="small">
        <el-form-item label="用户名" prop="username">
          <el-input v-model="addManager.username"></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="password">
          <el-input type="password" v-model="addManager.password"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="addUserSubmit(addManager)">立即创建</el-button>
          <el-button @click="addManagerDialog = false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <!-- 添加学生 -->
    <el-dialog
      title="添加学生"
      :visible.sync="addStudentDialog"
      width="50%"
      :before-close="handleClose">
      <el-form :model="addStudent" ref="addStudentForm" :rules="addStudentRules" label-width="80px" :inline="false" size="small">
        <el-form-item label="用户名" prop="username">
          <el-input v-model="addStudent.username"></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="password">
          <el-input type="password" v-model="addStudent.password"></el-input>
        </el-form-item>
        <el-form-item label="学号" prop="studentNum">
          <el-input v-model="addStudent.studentNum"></el-input>
        </el-form-item>
        <el-form-item label="姓名" prop="name">
          <el-input v-model="addStudent.name"></el-input>
        </el-form-item>
        <el-form-item label="性别" prop="sex">
          <!-- <el-input v-model="addStudent.sex"></el-input> -->
          <el-select v-model="addStudent.sex" placeholder="请选择">
            <el-option label="男" value="男"></el-option>
            <el-option label="女" value="女"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="民族" prop="nationality">
          <el-input v-model="addStudent.nationality"></el-input>
        </el-form-item>
        <el-form-item label="身份证号" prop="idNum">
          <el-input v-model="addStudent.idNum"></el-input>
        </el-form-item>
        <el-form-item label="生日" prop="birthday">
          <el-input v-model="addStudent.birthday"></el-input>
        </el-form-item>
        <el-form-item label="电话号码" prop="telephone">
          <el-input v-model="addStudent.telephone"></el-input>
        </el-form-item>
        <el-form-item label="邮件地址" prop="email">
          <el-input v-model="addStudent.email"></el-input>
        </el-form-item>
        <el-form-item label="籍贯" prop="nativePlace">
          <el-input v-model="addStudent.nativePlace"></el-input>
        </el-form-item>
        <el-form-item label="政治面貌" prop="politicalStatus">
          <!-- <el-input v-model="addStudent.politicalStatus"></el-input> -->
          <el-select v-model="addStudent.politicalStatus" placeholder="请选择">
            <el-option label="共青团员" value="共青团员"></el-option>
            <el-option label="共产党员" value="共产党员"></el-option>
            <el-option label="群众" value="群众"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="地址" prop="address">
          <el-input v-model="addStudent.address"></el-input>
        </el-form-item>
        <el-form-item label="年级" prop="grade">
          <el-input v-model="addStudent.grade"></el-input>
        </el-form-item>
        <el-form-item label="专业" prop="className">
          <!-- <el-input v-model="addStudent.className"></el-input> -->
          <el-select v-model="addStudent.className" placeholder="请选择">
            <el-option v-for="(item, index) in majorList" :key="index" :label="item" :value="item"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="学历" prop="educationalBackground">
          <!-- <el-input v-model="addStudent.educationalBackground"></el-input> -->
          <el-select v-model="addStudent.educationalBackground" placeholder="请选择">
            <el-option label="本科在读" value="本科在读"></el-option>
            <el-option label="硕士" value="硕士"></el-option>
            <el-option label="博士" value="博士"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="addUserSubmit(addStudent)">立即创建</el-button>
          <el-button @click="addStudentDialog = false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <!-- 添加教师 -->
    <el-dialog
      title="添加教师"
      :visible.sync="addTeacherDialog"
      width="30%"
      :before-close="handleClose">
      <el-form :model="addTeacher" ref="addTeacherForm" :rules="addTeacherRules" label-width="80px" :inline="false" size="small">
        <el-form-item label="用户名" prop="username">
          <el-input v-model="addTeacher.username"></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="password">
          <el-input type="password" v-model="addTeacher.password"></el-input>
        </el-form-item>
        <el-form-item label="工号" prop="teacherNum">
          <el-input v-model="addTeacher.teacherNum"></el-input>
        </el-form-item>
        <el-form-item label="姓名" prop="name">
          <el-input v-model="addTeacher.name"></el-input>
        </el-form-item>
        <el-form-item label="性别" prop="sex">
          <el-select v-model="addTeacher.sex" placeholder="请选择">
            <el-option label="男" value="男"></el-option>
            <el-option label="女" value="女"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="民族" prop="nationality">
          <el-input v-model="addTeacher.nationality"></el-input>
        </el-form-item>
        <el-form-item label="身份证号" prop="idNum">
          <el-input v-model="addTeacher.idNum"></el-input>
        </el-form-item>
        <el-form-item label="生日" prop="birthday">
          <el-input v-model="addTeacher.birthday"></el-input>
        </el-form-item>
        <el-form-item label="电话号码" prop="telephone">
          <el-input v-model="addTeacher.telephone"></el-input>
        </el-form-item>
        <el-form-item label="邮件地址" prop="email">
          <el-input v-model="addTeacher.email"></el-input>
        </el-form-item>
        <el-form-item label="籍贯" prop="nativePlace">
          <el-input v-model="addTeacher.nativePlace"></el-input>
        </el-form-item>
        <el-form-item label="政治面貌" prop="politicalStatus">
          <!-- <el-input v-model="addTeacher.politicalStatus"></el-input> -->
          <el-select v-model="addTeacher.politicalStatus" placeholder="请选择">
            <el-option label="共青团员" value="共青团员"></el-option>
            <el-option label="共产党员" value="共产党员"></el-option>
            <el-option label="群众" value="群众"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="地址" prop="address">
          <el-input v-model="addTeacher.address"></el-input>
        </el-form-item>
        <el-form-item label="职称" prop="position">
          <!-- <el-input v-model="addTeacher.position"></el-input> -->
          <el-select v-model="addTeacher.position" placeholder="请选择">
            <el-option label="教授" value="教授"></el-option>
            <el-option label="讲师" value="讲师"></el-option>
            <el-option label="副教授" value="副教授"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="学院" prop="schoolName">
          <!-- <el-input v-model="addTeacher.schoolName"></el-input> -->
          <el-select v-model="addTeacher.schoolName" placeholder="请选择">
            <el-option v-for="(item, index) in schoolList" :key="index" :label="item" :value="item"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="学历" prop="educationalBackground">
          <!-- <el-input v-model="addTeacher.educationalBackground"></el-input> -->
          <el-select v-model="addTeacher.educationalBackground" placeholder="请选择">
            <el-option label="本科在读" value="本科在读"></el-option>
            <el-option label="硕士" value="硕士"></el-option>
            <el-option label="博士" value="博士"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="addUserSubmit(addTeacher)">立即创建</el-button>
          <el-button @click="addTeacherDialog = false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <!-- 编辑管理员详细信息 -->
    <el-dialog
      title="查看管理员"
      :visible.sync="editManagerDialog"
      width="30%"
      :before-close="handleClose">
      <el-form :model="currentUser" label-width="80px" :inline="false" size="small">
        <el-form-item label="用户名" prop="username">
          <el-input disabled v-model="currentUser.username"></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="password">
          <el-input disabled type="password" v-model="currentUser.password"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="editManagerDialog = false">确认</el-button>
          <el-button @click="editManagerDialog = false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <!-- 编辑学生详细信息 -->
    <el-dialog
      title="编辑学生详细信息"
      :visible.sync="editStudentDialog"
      width="30%"
      :before-close="handleClose">
      <el-form :model="currentUser" ref="editStudentForm" :rules="editStudentRules" label-width="80px" :inline="false" size="small">
        <el-form-item label="用户名" prop="username">
          <el-input disabled v-model="currentUser.username"></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="password">
          <el-input disabled type="password" v-model="currentUser.password"></el-input>
        </el-form-item>
        <el-form-item label="姓名" prop="name">
          <el-input v-model="currentUser.name"></el-input>
        </el-form-item>
        <el-form-item label="性别" prop="sex">
          <!-- <el-input v-model="currentUser.sex"></el-input> -->
          <el-select v-model="currentUser.sex" placeholder="请选择">
            <el-option label="男" value="男"></el-option>
            <el-option label="女" value="女"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="民族" prop="nationality">
          <el-input v-model="currentUser.nationality"></el-input>
        </el-form-item>
        <el-form-item label="身份证号" prop="id_num">
          <el-input v-model="currentUser.id_num"></el-input>
        </el-form-item>
        <el-form-item label="生日" prop="birthday">
          <el-input v-model="currentUser.birthday"></el-input>
        </el-form-item>
        <el-form-item label="电话号码" prop="telephone">
          <el-input v-model="currentUser.telephone"></el-input>
        </el-form-item>
        <el-form-item label="邮件地址" prop="email">
          <el-input v-model="currentUser.email"></el-input>
        </el-form-item>
        <el-form-item label="籍贯" prop="native_place">
          <el-input v-model="currentUser.native_place"></el-input>
        </el-form-item>
        <el-form-item label="政治面貌" prop="political_status">
          <!-- <el-input v-model="currentUser.politicalStatus"></el-input> -->
          <el-select v-model="currentUser.political_status" placeholder="请选择">
            <el-option label="共青团员" value="共青团员"></el-option>
            <el-option label="共产党员" value="共产党员"></el-option>
            <el-option label="群众" value="群众"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="地址" prop="address">
          <el-input v-model="currentUser.address"></el-input>
        </el-form-item>
        <el-form-item label="学历" prop="educational_background">
          <!-- <el-input v-model="currentUser.educationalBackground"></el-input> -->
          <el-select v-model="currentUser.educational_background" placeholder="请选择">
            <el-option label="本科在读" value="本科在读"></el-option>
            <el-option label="硕士" value="硕士"></el-option>
            <el-option label="博士" value="博士"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="editUserSubmit()">确认</el-button>
          <el-button @click="editStudentDialog = false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <!-- 编辑教师详细信息 -->
    <el-dialog
      title="编辑教师详细信息"
      :visible.sync="editTeacherDialog"
      width="30%"
      :before-close="handleClose">
      <el-form :model="currentUser" ref="editTeacherForm" :rules="editTeacherRules" label-width="80px" :inline="false" size="small">
        <el-form-item label="用户名" prop="username">
          <el-input disabled v-model="currentUser.username"></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="password">
          <el-input disabled type="password" v-model="currentUser.password"></el-input>
        </el-form-item>
        <el-form-item label="姓名" prop="name">
          <el-input v-model="currentUser.name"></el-input>
        </el-form-item>
        <el-form-item label="性别" prop="sex">
          <el-select v-model="currentUser.sex" placeholder="请选择">
            <el-option label="男" value="男"></el-option>
            <el-option label="女" value="女"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="民族" prop="nationality">
          <el-input v-model="currentUser.nationality"></el-input>
        </el-form-item>
        <el-form-item label="身份证号" prop="id_num">
          <el-input v-model="currentUser.id_num"></el-input>
        </el-form-item>
        <el-form-item label="生日" prop="birthday">
          <el-input v-model="currentUser.birthday"></el-input>
        </el-form-item>
        <el-form-item label="电话号码" prop="telephone">
          <el-input v-model="currentUser.telephone"></el-input>
        </el-form-item>
        <el-form-item label="邮件地址" prop="email">
          <el-input v-model="currentUser.email"></el-input>
        </el-form-item>
        <el-form-item label="籍贯" prop="native_place">
          <el-input v-model="currentUser.native_place"></el-input>
        </el-form-item>
        <el-form-item label="政治面貌" prop="political_status">
          <!-- <el-input v-model="currentUser.politicalStatus"></el-input> -->
          <el-select v-model="currentUser.political_status" placeholder="请选择">
            <el-option label="共青团员" value="共青团员"></el-option>
            <el-option label="共产党员" value="共产党员"></el-option>
            <el-option label="群众" value="群众"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="地址" prop="address">
          <el-input v-model="currentUser.address"></el-input>
        </el-form-item>
        <!-- <el-form-item label="职称" prop="position">
          <el-select v-model="currentUser.position" placeholder="请选择">
            <el-option label="教授" value="教授"></el-option>
            <el-option label="讲师" value="讲师"></el-option>
            <el-option label="副教授" value="副教授"></el-option>
          </el-select>
        </el-form-item> -->
        <el-form-item label="学历" prop="educational_background">
          <!-- <el-input v-model="currentUser.educationalBackground"></el-input> -->
          <el-select v-model="currentUser.educational_background" placeholder="请选择">
            <el-option label="本科在读" value="本科在读"></el-option>
            <el-option label="硕士" value="硕士"></el-option>
            <el-option label="博士" value="博士"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="editUserSubmit()">确认</el-button>
          <el-button @click="editTeacherDialog = false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

  </div>
</template>

<script>
import { toDateString } from '@/utils/time.js'
import { getAllMajors, getAllSchools } from '@/utils/dropdown.js'
export default {
  data () {
    // 验证生份证
    var checkIdNum = (rule, value, cb) => {
      // 教的unicode码就是\u6559
      const reg = /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}$)/

      if (reg.test(value)) {
        return cb()
      }

      cb(new Error('请输入正确的身份证号码!'))
    }
    var checkPhoneNum = (rule, value, cb) => {
      // 教的unicode码就是\u6559
      const reg = /^[1][3,4,5,7,8][0-9]{9}$/

      if (reg.test(value)) {
        return cb()
      }

      cb(new Error('请输入正确的手机号号码!'))
    }
    var checkEmail = (rule, value, cb) => {
      // 教的unicode码就是\u6559
      const reg = /^[0-9a-zA-Z_.-]+[@][0-9a-zA-Z_.-]+([.][a-zA-Z]+){1,2}$/

      if (reg.test(value)) {
        return cb()
      }

      cb(new Error('请输入正确的邮箱格式!'))
    }
    var checkDay = (rule, value, cb) => {
      const reg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])$/

      if (reg.test(value)) {
        return cb()
      }

      cb(new Error('请输入正确的日期格式!如：2001-01-01'))
    }

    return {
      // 表单验证
      addManagerRules: {
        username: [
          { required: true, message: '请输入用户名', trigger: 'blur'}
        ],
        password: [
          { required: true, message: '请输入密码', trigger: 'blur'}
        ],
      },
      addStudentRules: {
        username: [
          { required: true, message: '请输入用户名', trigger: 'blur'}
        ],
        password: [
          { required: true, message: '请输入密码', trigger: 'blur'}
        ],
        name: [
          { required: true, message: '请输入姓名', trigger: 'blur'}
        ],
        studentNum: [
          { required: true, message: '请输入学号', trigger: 'blur'}
        ],
        sex: [
          { required: true, message: '请输入性别', trigger: 'change'}
        ],
        nationality: [
          { required: true, message: '请输入民族', trigger: 'blur'}
        ],
        idNum: [
          { required: true, message: '请输入身份证号码', trigger: 'blur'},
          { validator: checkIdNum, trigger: 'blur'}
        ],
        birthday: [
          { required: true, message: '请输入生日', trigger: 'blur'},
          { validator: checkDay, trigger: 'blur'}
        ],
        telephone: [
          { required: true, message: '请输入手机号码', trigger: 'blur'},
          { validator: checkPhoneNum, trigger: 'blur'}
        ],
        email: [
          { required: true, message: '请输入邮件地址', trigger: 'blur'},
          { validator: checkEmail, trigger: 'blur'}
        ],
        nativePlace: [
          { required: true, message: '请输入籍贯', trigger: 'blur'},
        ],
        politicalStatus: [
          { required: true, message: '请选择政治面貌', trigger: 'change'},
        ],
        address: [
          { required: true, message: '请输入地址', trigger: 'blur'},
        ],
        grade: [
          { required: true, message: '请输入年级', trigger: 'blur'},
        ],
        className: [
          { required: true, message: '请选择专业', trigger: 'change'},
        ],
        educationalBackground: [
          { required: true, message: '请选择学历', trigger: 'change'},
        ],
      },
      addTeacherRules: {
        username: [
          { required: true, message: '请输入用户名', trigger: 'blur'}
        ],
        password: [
          { required: true, message: '请输入密码', trigger: 'blur'}
        ],
        name: [
          { required: true, message: '请输入姓名', trigger: 'blur'}
        ],
        teacherNum: [
          { required: true, message: '请输入工号', trigger: 'blur'}
        ],
        sex: [
          { required: true, message: '请选择性别', trigger: 'change'}
        ],
        nationality: [
          { required: true, message: '请输入民族', trigger: 'blur'}
        ],
        idNum: [
          { required: true, message: '请输入身份证号码', trigger: 'blur'},
          { validator: checkIdNum, trigger: 'blur'}
        ],
        birthday: [
          { required: true, message: '请输入生日', trigger: 'blur'},
          { validator: checkDay, trigger: 'blur'}
        ],
        telephone: [
          { required: true, message: '请输入手机号码', trigger: 'blur'},
          { validator: checkPhoneNum, trigger: 'blur'}
        ],
        email: [
          { required: true, message: '请输入邮件地址', trigger: 'blur'},
          { validator: checkEmail, trigger: 'blur'}
        ],
        nativePlace: [
          { required: true, message: '请输入籍贯', trigger: 'blur'},
        ],
        politicalStatus: [
          { required: true, message: '请选择政治面貌', trigger: 'change'},
        ],
        address: [
          { required: true, message: '请输入地址', trigger: 'blur'},
        ],
        position: [
          { required: true, message: '请选择职称', trigger: 'change'},
        ],
        schoolName: [
          { required: true, message: '请选择学院', trigger: 'change'},
        ],
        educationalBackground: [
          { required: true, message: '请选择学历', trigger: 'change'},
        ],
      },
      editStudentRules: {
        name: [
          { required: true, message: '请输入姓名', trigger: 'blur'}
        ],
        studentNum: [
          { required: true, message: '请输入学号', trigger: 'blur'}
        ],
        sex: [
          { required: true, message: '请输入性别', trigger: 'change'}
        ],
        nationality: [
          { required: true, message: '请输入民族', trigger: 'blur'}
        ],
        id_num: [
          { required: true, message: '请输入身份证号码', trigger: 'blur'},
          { validator: checkIdNum, trigger: 'blur'}
        ],
        birthday: [
          { required: true, message: '请输入生日', trigger: 'blur'},
          { validator: checkDay, trigger: 'blur'}
        ],
        telephone: [
          { required: true, message: '请输入手机号码', trigger: 'blur'},
          { validator: checkPhoneNum, trigger: 'blur'}
        ],
        email: [
          { required: true, message: '请输入邮件地址', trigger: 'blur'},
          { validator: checkEmail, trigger: 'blur'}
        ],
        native_place: [
          { required: true, message: '请输入籍贯', trigger: 'blur'},
        ],
        political_status: [
          { required: true, message: '请选择政治面貌', trigger: 'change'},
        ],
        address: [
          { required: true, message: '请输入地址', trigger: 'blur'},
        ],
        // grade: [
        //   { required: true, message: '请输入年级', trigger: 'blur'},
        // ],
        educational_background: [
          { required: true, message: '请选择学历', trigger: 'change'},
        ],
      },
      editTeacherRules: {
        name: [
          { required: true, message: '请输入姓名', trigger: 'blur'}
        ],
        sex: [
          { required: true, message: '请选择性别', trigger: 'change'}
        ],
        nationality: [
          { required: true, message: '请输入民族', trigger: 'blur'}
        ],
        id_num: [
          { required: true, message: '请输入身份证号码', trigger: 'blur'},
          { validator: checkIdNum, trigger: 'blur'}
        ],
        birthday: [
          { required: true, message: '请输入生日', trigger: 'blur'},
          { validator: checkDay, trigger: 'blur'}
        ],
        telephone: [
          { required: true, message: '请输入手机号码', trigger: 'blur'},
          { validator: checkPhoneNum, trigger: 'blur'}
        ],
        email: [
          { required: true, message: '请输入邮件地址', trigger: 'blur'},
          { validator: checkEmail, trigger: 'blur'}
        ],
        native_place: [
          { required: true, message: '请输入籍贯', trigger: 'blur'},
        ],
        political_status: [
          { required: true, message: '请选择政治面貌', trigger: 'change'},
        ],
        address: [
          { required: true, message: '请输入地址', trigger: 'blur'},
        ],
        // position: [
        //   { required: true, message: '请选择职称', trigger: 'change'},
        // ],
        school_name: [
          { required: true, message: '请选择学院', trigger: 'change'},
        ],
        educational_background: [
          { required: true, message: '请选择学历', trigger: 'change'},
        ],
      },


      // 被选中的角色
      selectedRole: 0,
      roleOption: [{
        value: 0,
        label: '所有人'
      }, {
        value: 1,
        label: '超级管理员'
      }, {
        value: 2,
        label: '学生'
      }, {
        value: 3,
        label: '老师'
      }, {
        value: 4,
        label: '一般管理员'
      }],
      // 当前页
      currentPage: 1,
      // 用户数据
      userTable: [],
      userNum: 0,
      addManagerDialog: false,
      addStudentDialog: false,
      addTeacherDialog: false,
      editManagerDialog: false,
      editStudentDialog: false,
      editTeacherDialog: false,
      addManager: {
        identity: 0,
        username: '',
        password: ''
      },
      addStudent: {
        identity: 2,
        username: '', // "lsk"
        password: '', // 123456,
        name: '', // "钟怡雯",
        sex: '', // "女",
        nationality: '', // "汉族",
        idNum: '', // 123456,
        birthday: '',  // "2000-01-01",
        telephone: '', // 123456,
        email: '', // "123456@qq.com",
        nativePlace: '', // "湖北",
        politicalStatus: '', // "共青团员",
        address: '', // "地球",
        grade: '', // 2019,
        className: '', // "软件工程",
        studentNum: '', // 2019001,
        educationalBackground: '', // "本科在读",
        // schoolName: '', //  "计算机与信息工程学院",
        // id: 0
      },
      addTeacher: {
        identity: 3,
        username: '', // "lsk"
        password: '', // 123456,
        name: '', // "钟怡雯",
        sex: '', // "女",
        nationality: '', // "汉族",
        idNum: '', // 123456,
        birthday: '',  // "2000-01-01",
        telephone: '', // 123456,
        email: '', // "123456@qq.com",
        nativePlace: '', // "湖北",
        politicalStatus: '', // "共青团员",
        address: '', // "地球",
        position: '', // "教授",
        schoolName: '', //  "计算机与信息工程学院",
        teacherNum: '', // 20102,
        educationalBackground: '', // "本科在读",
        // id: 0,
      },
      currentUser: {},
      majorList: [],
      schoolList: [],
    }
  },
  async created () {
    this.getUserList()
    this.majorList = await getAllMajors()
    this.schoolList = await getAllSchools()
  },
  methods: {
    // 获取所有的用户
    async getUserList () {
      this.userTable = []
      const { data: res } = await this.$http.post(`user/admin/getUserList?page=${this.currentPage - 1}&rows=10&identity=${this.selectedRole}`)
      console.log(res)
      if (!res.state) return this.$message.error(res.msg)
      this.userTable = this.foreachObj(res.detail.list)
      this.userNum = res.detail.total
    },

    // 更改当前页
    handleCurrentChange (page) {
      this.currentPage = page
      this.getUserList()
    },

    // 下线用户
    async logoutUser (id) {
      const { data: res } = await this.$http.post(`user/superAdmin/logoutUserById?id=${id}`)
      // console.log(res)
      if (!res.state) return this.$message.error(res.msg)
      this.$message.success(res.msg)
      this.getUserList()
    },

    // 冻结/解冻用户
    async frozenUser (user) {
      if (user.banState == 0) {
        // 冻结
        this.$confirm('此操作将冻结该用户, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(async () => {
          const { data: res } = await this.$http.post(`user/superAdmin/banUserById?id=${user.id}`)
          // console.log(res)
          if (!res.state) return this.$message.error(res.msg)
          this.$message.success(res.msg)
          this.getUserList()
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消冻结'
          })
        })
      } else {
        // 解冻
        this.$confirm('此操作将解冻该用户, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(async () => {
          const { data: res } = await this.$http.post(`user/superAdmin/releaseUserById?id=${user.id}`)
          // console.log(res)
          if (!res.state) return this.$message.error(res.msg)
          this.$message.success(res.msg)
          this.getUserList()
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取解冻'
          })
        })
      }
    },

    // 新增一个用户
    addUser () {
      this.$prompt('请输入要增加的用户类型：超级管理员填1，学生填2，教师填3，一般管理员填4', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          // inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
          inputPattern: /^(1|2|3|4)$/,
          inputErrorMessage: '输入格式不正确'
        }).then(({ value }) => {
          this.addManager = {
            identity: 0,
            username: '',
            password: ''
          }
          this.addStudent = {
            identity: 2,
            username: '', // "lsk"
            password: '', // 123456,
            name: '', // "钟怡雯",
            sex: '', // "女",
            nationality: '', // "汉族",
            idNum: '', // 123456,
            birthday: '',  // "2000-01-01",
            telephone: '', // 123456,
            email: '', // "123456@qq.com",
            nativePlace: '', // "湖北",
            politicalStatus: '', // "共青团员",
            address: '', // "地球",
            position: '', // "教授",
            schoolName: '', //  "计算机与信息工程学院",
            teacherNum: '', // 20102,
            educationalBackground: '', // "本科在读",
            // id: 0,
          }
          this.addTeacher = {
            identity: 3,
            username: '', // "lsk"
            password: '', // 123456,
            name: '', // "钟怡雯",
            sex: '', // "女",
            nationality: '', // "汉族",
            idNum: '', // 123456,
            birthday: '',  // "2000-01-01",
            telephone: '', // 123456,
            email: '', // "123456@qq.com",
            nativePlace: '', // "湖北",
            politicalStatus: '', // "共青团员",
            address: '', // "地球",
            position: '', // "教授",
            schoolName: '', //  "计算机与信息工程学院",
            teacherNum: '', // 20102,
            educationalBackground: '', // "本科在读",
          }
          value = parseInt(value)
          if (value === 1) {
            this.addManagerDialog = true
            this.addManager.identity = 1
          }else if (value === 2) {
            this.addStudentDialog = true
          }else if (value === 3) {
            this.addTeacherDialog = true
          }else if (value === 4) {
            this.addManagerDialog = true
            this.addManager.identity = 4
          }
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '取消输入'
          });
        });
    },

    // 新增一个用户的提交
    addUserSubmit (user) {
      console.log(user)
      if (user.identity === 1 || user.identity === 4) {
        this.$refs.addManagerForm.validate(async valid => {
          if (!valid) return
          const { data: res } = await this.$http.post(`user/superAdmin/createUser`, user)
          console.log(res)
          if (!res.state) return this.$message.error(res.msg)
          this.$message.success('新增成功！')
          this.addManagerDialog = false
          this.getUserList()
        })
      }else if (user.identity === 2) {
        this.$refs.addStudentForm.validate(async valid => {
          if (!valid) return
          const { data: res } = await this.$http.post(`user/superAdmin/createUser`, user)
          console.log(res)
          if (!res.state) return this.$message.error(res.msg)
          this.$message.success('新增成功！')
          this.addStudentDialog = false
          this.getUserList()
        })
      }else if (user.identity === 3) {
        this.$refs.addTeacherForm.validate(async valid => {
          if (!valid) return
          const { data: res } = await this.$http.post(`user/superAdmin/createUser`, user)
          console.log(res)
          if (!res.state) return this.$message.error(res.msg)
          this.$message.success('新增成功！')
          this.addTeacherDialog = false
          this.getUserList()
        })
      }
    },

    // 编辑一个用户
    editUserInfo (user) {
      if (user.identity === 1 || user.identity === 4) {
        this.editManagerDialog = true
      }else if (user.identity === 2) {
        this.editStudentDialog = true
      }else if (user.identity === 3) {
        this.editTeacherDialog = true
      }
      this.currentUser = user
    },

    // 编辑一个用户的提交按钮
    editUserSubmit () {
      this.currentUser.idNum = this.currentUser.id_num
      this.currentUser.nativePlace = this.currentUser.native_place
      this.currentUser.politicalStatus = this.currentUser.political_status
      this.currentUser.educationalBackground = this.currentUser.educational_background
      if (this.currentUser.identity === 2) {
        // 学生的处理
        // data.studentNum = this.currentUser.student_num
        this.$refs.editStudentForm.validate(async valid => {
          if (!valid) return
          const { data: res } = await this.$http.post(`user/superAdmin/updateUser`, this.currentUser)
          console.log(res)
          if (!res.state) return this.$message.error(res.msg)
          this.$message.success('修改成功！')
          this.editStudentDialog = false
          this.getUserList()
        })
      }else if (this.currentUser.identity === 3) {
        // 处理教师的
        this.$refs.editTeacherForm.validate(async valid => {
          if (!valid) return
          const { data: res } = await this.$http.post(`user/superAdmin/updateUser`, this.currentUser)
          console.log(res)
          if (!res.state) return this.$message.error(res.msg)
          this.$message.success('修改成功！')
          this.editTeacherDialog = false
          this.getUserList()
        })
      }
    },

    // 删除一个用户
    deleteUser (id) {
      this.$confirm('此操作将永久删除该用户, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const { data: res } = await this.$http.post(`user/superAdmin/deleteUser?userId=${id}`)
        console.log(res)
        if (!res.state) return this.$message.error(res.msg)
        this.$message({
          type: 'success',
          message: '删除成功!'
        });
        this.getUserList()
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },

    handleClose (done) {
      done()
    },

    // 对后端传来的数据进行处理
    foreachObj (data) {
      data.map(item => {
        item.create_time = toDateString(item.create_time)
        item.update_time = toDateString(item.update_time)
        if (item.identity === 1) {
          item.role = '超级管理员'
        } else if (item.identity === 2) {
          item.role = '学生'
        } else if (item.identity === 3) {
          item.role = '教师'
        } else if (item.identity === 4) {
          item.role = '一般管理员'
        }
      })
      return data
    }
  }
}
</script>

<style lang="less" scoped>

</style>
